<template>
  <div class="login-box">
    <div class="header">
      <van-nav-bar title="登录" left-arrow @click-left="$router.back()">
      </van-nav-bar>
    </div>
    <div class="content">
      <van-form @submit="onSubmit">
        <van-field
          v-model="username"
          placeholder="手机号/账户名/邮箱"
          clearable
        />
        <van-field
          v-model="password"
          :type="formType"
          placeholder="请输入密码"
          :right-icon="eye"
          @click="showPass"
          clearable
        />
        <div style="margin: 16px 0">
          <van-button
            type="Info"
            round
            block
            native-type="submit"
            color="linear-gradient(to right, #ff6034, #ee0a24)"
            :disabled="this.username && this.password ? false : true"
            >登录</van-button
          >
        </div>
      </van-form>
      <div class="tip">
        <a href="#/register">手机快速注册</a>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "LoginPage",
  data() {
    return {
      username: "",
      password: "",
      eye: "closed-eye",
      formType: "password",
      disabled_flag: true,
    };
  },
  methods: {
    showPass(e) {
      if (e.target.nodeName == "I") {
        if (this.eye == "closed-eye") {
          this.eye = "eye-o";
          this.formType = "text";
        } else {
          this.eye = "closed-eye";
          this.formType = "password";
        }
      }
    },
    onSubmit() {
      this.$http({
        url: "user/login",
        method: "post",
        data: {
          loginname: this.username,
          password: this.password,
        },
      }).then((res) => {
        if (res.data.code == "200") {
          this.$store.commit({
            type: "saveUserMsg",
            userid: res.data.data.userid,
            token: res.data.data.token,
          });
          sessionStorage.setItem("token", res.data.data.token);
          sessionStorage.setItem("userid", res.data.data.userid);
          if (this.$route.query.path) {
            this.$router.push(this.$route.query.path);
          } else {
            this.$router.replace("/MyPage");
          }
        }
        if (res.data.code == "10010") {
          this.$dialog
            .confirm({
              message: "该账户未被注册,请先注册",
              confirmButtonText: "立即注册",
            })
            .then(() => {
              this.$router.push("/register");
            })
            .catch(() => {
              // on cancel
            });
        }
        if (res.data.code == "10011") {
          this.$toast("密码错误");
        }
      });
    },
  },
};
</script>

<style scoped>
.content {
  padding: 35px 15px;
  position: relative;
}
.van-button {
  margin-top: 1.5625rem;
}
.tip {
  position: absolute;
  bottom: 18px;
  right: 15px;
}
.tip a {
  font-size: 12px;
  color: #551a8b;
}
</style>